<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="../manager/base.jsp"%>
<script type="text/javascript" src="${ctx}/layui/layui.all.js"></script>
<link rel="stylesheet" type="text/css" href="${ctx}/layui/css/layui.css">

<script type="text/javascript" src="${ctx}/js/layui_common.js"></script>
<script type="text/javascript">
	$(function() {
		//自适应屏幕宽度

		var main_h = $(window).height();
		$('.hy_list').css('height', main_h - 45 + 'px');

		var main_w = $(window).width();
		$('.xjhy').css('width', main_w - 40 + 'px');

		$(".tabBox .tabCont:first").css("display", "block");
		$(".tabBox .tabNav li").click(
				function() {
					$(this).siblings("li").removeClass("now");
					$(this).addClass("now");
					$(this).parents(".tabBox").find(".tabCont").css("display",
							"none");
					var i = $(this).index();
					$(this).parents(".tabBox").find(".tabCont:eq(" + i + ")")
							.css("display", "block");
				});

		$('.xial_m span').click(function() {
			$(this).parent('.xial_m').siblings('.xl_ctn').toggle();
		});
	});
	<!--框架高度设置-->
</script>
<script type="text/javascript">
	$(function() {
		getConstruction('', '');
		var selectHtml = getAllConstructionInfo('');
		$("select[name='device_name']").html(selectHtml);
	})
	function getAllConstructionInfo(id) {
		var optionHtml = "<option value=\"\">请选择</option>";
		$.ajax({
					url : '${ctx}/basicsData/getAllBasicsDataInfo',
					data : {},
					type : 'get',
					async : false,
					dataType : 'json',
					success : function(data) {
						if (data != null) {
							$.each(
											data,
											function(index, item) {
												if (item.id == id) {
													optionHtml += '<option value="'+item.id+'" selected="selected">'
															+ item.name
															+ '</option>';
												} else {
													optionHtml += '<option value="'+item.id+'">'
															+ item.name
															+ '</option>';
												}

											})

						}
					}
				});
		return optionHtml;
	}
	function getConstructionInfo() {
		var name = $("input[name='name']").val();
		getConstruction(name);
	}

	function getConstruction(name) {
		var i;
		$.ajax({
					url : '${ctx}/construction/getConstructionInfo',
					data : {
						"name" : name
					},
					type : 'get',
					dataType : 'json',
					async : false,
					beforeSend : function() {
						i = layer.open({
							type : 3,
							area : '500px',
							skin : 'layui-layer-molv',
							shade : 0.5,
							shadeClose : true,
							maxmin : true
						});
					},
					success : function(data) {
						layer.close(i);
						$("#userInfo").html("");
						if (data != null) {
							$.each(
											data,
											function(index, item) {
												var html = "";
												html += "<tr>";
												html += "<td>" + item.name
														+ "</td>";
												html += "<td>" + item.project
														+ "</td>";
												html += "<td>" + item.builders
														+ "</td>";
												html += "<td>" + item.checker
														+ "</td>";
												html += "<td>" + item.rating
														+ "</td>";
												html += "<td>"
														+ item.createtime
														+ "</td>";
												html += "<td>";
												html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"updateConstuctionInfo('"
															+ item.uuid
															+ "')\">修改</a>";
												html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"deleteConstuctionInfo('"
															+ item.uuid
															+ "')\">删除</a>";
												html += "</td>";
												html += "</tr>";
												$("#userInfo").append(html);
											});

						}
						//添加分页
						//计算总数
						var total = 0;
						if (data == null) {
							total = 0;
						} else if (data.length == 0 || data[0].cnt == null
								|| data[0].cnt == ""
								|| data[0].cnt == undefined) {
							total = 0;
						} else {
							total = data[0].cnt;
						}
						//定义一个laypage实例
						var laypage = layui.laypage;
						laypage
								.render({
									elem : 'r_foot_m', //注意，这里的 test1 是 ID，不用加 # 号
									count : total,
									prev : '上一页',
									next : '下一页',
									cont : 'claimpage',
									skin : 'yahei',
									jump : function(obj, first) {
										if (first != true) {//是否首次进入页面
											var currentPage = obj.curr;//获取点击的页码
											//通过当前页数，获取对应的数据
											$
													.ajax({
														url : '${ctx}/construction/getConstructionInfo',
														data : {
															"name" : name,
															"page" : currentPage
														},
														type : 'get',
														dataType : 'json',
														beforeSend : function() {
															i = layer
																	.open({
																		type : 3,
																		area : '500px',
																		skin : 'layui-layer-molv',
																		shade : 0.5,
																		shadeClose : true,
																		maxmin : true
																	});
														},
														success : function(data) {
															layer.close(i);
															$("#userInfo")
																	.html("");
															if (data != null) {
																$
																		.each(
																				data,
																				function(
																						index,
																						item) {
																					var html = "";
																					html += "<tr>";
																					html += "<td>"
																							+ item.name
																							+ "</td>";
																					html += "<td>"
																							+ item.project
																							+ "</td>";
																					html += "<td>"
																							+ item.builders
																							+ "</td>";
																					html += "<td>"
																							+ item.checker
																							+ "</td>";
																					html += "<td>"
																							+ item.rating
																							+ "</td>";
																					html += "<td>"
																							+ item.createtime
																							+ "</td>";
																					html += "<td>";
																					html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"updateConstuctionInfo('"
																							+ item.uuid
																							+ "')\">添加</a>";
																					html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"deleteConstuctionInfo('"
																							+ item.uuid
																							+ "')\">删除</a>";
																					html += "</td>";
																					html += "</tr>";
																					$(
																							"#userInfo")
																							.append(
																									html);
																				});
															}
														},
														error : function(data) {
															layer.close(i);
														}
													});
										}
									}
								//数据总数，从服务端得到
								});
					}
				});
	}
</script>
<script type="text/javascript">
	//打开弹框 授予角色
	var index;
	function updateConstuctionInfo(uuid) {
		//通过id查询角色信息
		$.ajax({
					url : '${ctx}/construction/getConstructionInfo',
					data : {
						"uuid" : uuid
					},
					type : 'get',
					dataType : 'json',
					async : false,
					success : function(data) {
						$
								.each(
										data,
										function(index, item) {
											//添加下拉内容
											if (data != null) {
												//				var selectInfo = getFunParentName(data.pid);
												var html = "";
												html += '<div class="tabCont">';
												html += '<input type="hidden" id="updateid" value="'+item.uuid+'"/>';
												html += '<ul class="hypz">';
												html += '	<li class="clearfix"><span class="title">设备名称：</span>';
												html += '		<div class="li_r">';
												html += '			<input class="chang" name="deviceId" readonly= "true" type="text" value="'+item.name+'">';
												html += '		</div></li>';

												html += '	<li class="clearfix"><span class="title">施工项目：</span>';
												html += '		<div class="li_r">';
												html += '			<input class="chang" name="update_project" type="text" value="'+item.project+'"> <i>*</i>';
												html += '		</div></li>';

												html += '	<li class="clearfix"><span class="title">施工人员：</span>';
												html += '		<div class="li_r">';
												html += '			<input class="chang" name="update_builders" type="text" value="'+item.builders+'"> <i>*</i>';
												html += '		</div></li>';

												html += '	<li class="clearfix"><span class="title">检查人员：</span>';
												html += '		<div class="li_r">';
												html += '			<input class="chang" name="update_checker" type="text" value="'+item.checker+'"> <i>*</i>';
												html += '		</div></li>';

												html += '	<li class="clearfix"><span class="title">评定结果：</span>';
												html += '		<div class="li_r">';
												html += '			<select id="rating" name="update_rating" lay-verify=""><option value="" selected="selected">'+item.rating+'</option><option value="1">合格</option><option value="0">不合格</option></select> <i>*</i>';
												html += '		</div></li>';

												html += '	<li class="tj_btn"><a href="javascript:void(0);" onclick="updateConstructionInfo();">修改</a></li>';
												html += '</ul>';
												html += '</div>';
												//打开弹框，显示
												index = layer
														.open({
															type : 1,
															title : '用户修改',
															area : [ '600px',
																	'360px' ],
															shadeClose : true, //点击遮罩关闭
															content : html
														});
											}
										});
					}
				});
	}

	function updateConstructionInfo() {
		var i;
		var uuid = $("#updateid").val();
		var project = $("input[name='update_project']").val();
		var builders = $("input[name='update_builders']").val();
		var checker = $("input[name='update_checker']").val();
		var rating = $("select[name='update_rating'] option:selected").text();
		$.ajax({
			url : '${ctx}/construction/updateConstructionInfo',
			data : {
				"uuid" : uuid,
				"project" : project,
				"builders" : builders,
				"checker" : checker,
				"rating" : rating
			},
			type : 'post',
			dataType : 'html',
			beforeSend : function() {
				i = layer.open({
					type : 3,
					area : '500px',
					skin : 'layui-layer-molv',
					shade : 0.5,
					shadeClose : true,
					maxmin : true
				});
			},
			success : function(data) {
				if (data == "success") {
					layer.close(i);
					layer.alert("修改成功!", function() {
						window.location.reload();
						parent.layer.close(index);
					});
				}
			}
		});
	}
</script>
<script type="text/javascript">
	//删除角色
	function deleteConstuctionInfo(uuid) {
		layer.confirm('确定要删除这个用户吗?', {
			icon : 3,
			title : '提示'
		}, function(index) {
			$.ajax({
				url : '${ctx}/construction/deleteConstructionInfo',
				data : {
					"uuid" : uuid
				},
				type : 'post',
				dataType : 'html',
				success : function(data) {
					if (data == "success") {
						layer.alert("删除成功!", function() {
							window.location.reload();
							parent.layer.close(index);
						});
					}
				}
			});
		});
	}
</script>
<script type="text/javascript">
	function addConstructionInfo() {
		var i ;
		var deviceid = $("select[name='device_name'] option:selected").val();
		if (deviceid == null || deviceid == "" || deviceid == undefined) {
			//提示不能为空
			layer.alert("设备名称不能为空!");
			return;
		}
		var project = $("input[name='project']").val();
		var builders = $("input[name='builders']").val();
		var checker = $("input[name='checker']").val();
		var rating = $("select[name='rating'] option:selected").text();
		$.ajax({
			url : '${ctx}/construction/addConstructionInfo',
			data : {
				"deviceid" : deviceid,
				"project" : project,
				"builders" : builders,
				"checker" : checker,
				"rating" : rating
			},
			type : 'post',
			dataType : 'html',
			beforeSend : function() {
				i = layer.open({
					type : 3,
					area : '500px',
					skin : 'layui-layer-molv',
					shade : 0.5,
					shadeClose : true,
					maxmin : true
				});
			},
			success : function(data) {
				layer.close(i);
				if (data == "success") {
					layer.alert("添加成功!", function() {
						window.location.reload();
						parent.layer.close(index);
					});
				} else if (data == "has") {
					layer.alert("该用户名已存在!");
				}
			}
		});
	}
</script>
<div id="right_ctn">
	<div class="right_m">
		<!--列表-->
		<div class="hy_list">
			<div class="box_t">
				<span class="name">施工质量记录列表</span>
				<!--当前位置-->
				<div class="position">
					<a href=""><img src="${ctx}/images/icon5.png" alt="" /></a> <a
						href="">首页</a> <span><img src="${ctx}/images/icon3.png"
						alt="" /></span> <a href="">设备管理</a> <span><img
						src="${ctx}/images/icon3.png" alt="" /></span> <a href="">施工质量记录列表</a>
				</div>
				<!--当前位置-->
			</div>

			<!--新建权限-->
			<form action="" method="post">
				<div class="xjhy" style="padding: 0px;">
					<div class="tabBox_t">
						<div class="tabBox">
							<ul class="tabNav">
								<li class="now"><span>记录查询</span></li>
								<li><span>添加记录</span></li>
							</ul>
							<div class="tabCont" style="display: block; overflow: auto;">
								<!--所有权限-->
								<ul class="hypz gjpz clearfix">
									<!--查询-->
									<div class="search">
										<span>按设备的名称查询：</span>
										<div class="s_text">
											<input name="name" type="text">
										</div>
										<a href="javascript:void(0);" class="btn"
											onclick="getConstructionInfo()">查询</a>
									</div>
									<!--查询-->
									<div class="space_hx">&nbsp;</div>
									<!--列表-->
									<form action="" method="post">
										<table cellpadding="0" cellspacing="0" class="list_hy"
											style="width: 98%;">
											<tr>
												<th scope="col">设备名称</th>
												<th scope="col">施工项目</th>
												<th scope="col">施工人员</th>
												<th scope="col">检查人员</th>
												<th scope="col">评定结果</th>
												<th scope="col">记录时间</th>
												<th scope="col">操作</th>
											</tr>
											<tbody id="userInfo">
											</tbody>
										</table>
										<!--列表-->
										<!--右边底部-->
										<div class="r_foot">
											<div class="r_foot_m" id="r_foot_m"></div>
										</div>
									</form>
									<!--右边底部-->
								</ul>
								<!--所有权限-->
							</div>
							<div class="tabCont" style="height: 515px; overflow: auto;">
								<!--添加权限-->
								<ul class="hypz">
									<li class="clearfix"><span class="title">设备名称：</span>
										<div class="li_r">
											<select name="device_name" lay-verify="">
												<option value="">请选择</option>
											</select> <i>*</i>
										</div></li>
									<li class="clearfix"><span class="title">施工项目：</span>
										<div class="li_r">
											<input class="chang" name="project" type="text"> <i>*</i>
										</div></li>
									<li class="clearfix"><span class="title">施工人员：</span>
										<div class="li_r">
											<input class="chang" name="builders" type="text"> <i>*</i>
										</div></li>
									<li class="clearfix"><span class="title">检查人员：</span>
										<div class="li_r">
											<input class="chang" name="checker" type="text"> <i>*</i>
										</div></li>

									<li class="clearfix"><span class="title">评定结果：</span>
										<div class="li_r">
											<select id="rating" name="rating" lay-verify="">
												<option value="">请选择</option>
												<option value="1">合格</option>
												<option value="0">不合格</option>
											</select> <i>*</i>
										</div></li>
									<li class="tj_btn"><a href="javascript:void(0);"
										onclick="addConstructionInfo();">添加</a></li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</form>
		</div>
		<!--列表-->
	</div>
</div>